{% set providerChosen = (data.target == 'local') ? true : false %}

{% set machines = (data.vm.provider.local.machines is defined and data.vm.provider.local.machines)
    ? data.vm.provider.local.machines : [] %}
{% set syncedFolders = (data.vm.synced_folder is defined and data.vm.synced_folder)
    ? data.vm.synced_folder : [] %}

{% set proxy = (data.proxy.enabled is defined and data.proxy.enabled) ? true : false %}
{% set proxy_http = (data.proxy.proxy_http is defined) ? data.proxy.proxy_http : '' %}
{% set proxy_https = (data.proxy.proxy_https is defined) ? data.proxy.proxy_https : '' %}
{% set proxy_ftp = (data.proxy.proxy_ftp is defined) ? data.proxy.proxy_ftp : '' %}
{% set proxy_no_proxy = (data.proxy.proxy_no_proxy is defined) ? data.proxy.proxy_no_proxy : '' %}

<div class="container-fluid cm-container-white section-title">
    <div class="checkbox checkbox-lg no-padding">
        <input type="radio" id="vagrantfile-vm-provider-local-install"
               name="vagrantfile[target]" value="local"
               {% if providerChosen %}checked{% endif %}
               data-toggle="radio-collapse" data-target="#vagrantfile-local-container"
               data-enforce-group-single="vagrantfile"
               data-enable-on-check data-disable-on-uncheck />
        <label for="vagrantfile-vm-provider-local-install">Deploy to Local Host</label>

        <p>
            The virtual machine will live inside your local PC.
            <a href="#" data-toggle="modal"
               data-target="#vagrantfile-local-modal">Click here for instructions.</a>
        </p>
    </div>
</div>

<div id="vagrantfile-local-container"
     class="container-fluid collapse {% if providerChosen %}in{% endif %}">
    <div class="panel panel-default">
        <div class="panel-body">
            <div class="form-group col-xs-12">
                <div class="clearfix"><label>Provider</label></div>

                <input type="hidden" id="vagrantfile-vm-provider-local-box_url"
                       name="vagrantfile[vm][provider][local][box_url]"
                       value="{{ formValue(data.vm.provider.local.box_url) }}" />
                <input type="hidden" id="vagrantfile-vm-provider-local-box_version"
                       name="vagrantfile[vm][provider][local][box_version]"
                       value="{{ formValue(data.vm.provider.local.box_version) }}" />

                {% for key, value in data.ssh %}
                    <input type="hidden" id="vagrantfile-ssh-{{ key }}"
                        name="vagrantfile[ssh][{{ key }}]" value="{{ formValue(value) }}" />
                {% endfor %}

                {% for virtualizer in data.available.virtualizers %}
                    <div class="radio">
                        <input type="radio" id="vagrantfile-vm-provider-local-chosen_virtualizer-{{ virtualizer.name }}"
                           name="vagrantfile[vm][provider][local][chosen_virtualizer]"
                           value="{{ virtualizer.name }}"
                           {% if virtualizer.name == data.vm.provider.local.chosen_virtualizer %}checked{% endif %}
                           data-toggle="update-local-ip-address"
                           data-base-ip="{{ virtualizer.base_ip }}"
                        />
                        <label for="vagrantfile-vm-provider-local-chosen_virtualizer-{{ virtualizer.name }}">
                            {{ virtualizer.long_name }}
                        </label>
                        <div class="help-block">
                            {{ virtualizer.description|raw }}
                            {% if virtualizer.description_extra %}
                                <span class="label label-info" data-toggle="help-text">
                                    <i class="fa fa-ellipsis-h"></i></span>
                                <div class="hidden">{{ virtualizer.description_extra|raw }}</div>
                            {% endif %}
                        </div>
                    </div>
                {% endfor %}
            </div>

            <div class="form-group col-xs-12">
                <div class="clearfix"><label>Distro</label></div>

                {% for box in data.available.boxes %}
                    <div class="radio">
                        <input type="radio" id="vagrantfile-vm-provider-local-box-{{ box.box }}"
                               name="vagrantfile[vm][provider][local][box]"
                               value="{{ box.box }}"
                               {% if box.box == data.vm.provider.local.box %}checked{% endif %} />
                        <label for="vagrantfile-vm-provider-local-box-{{ box.box }}">
                            {{ box.name }}
                        </label>
                    </div>
                {% endfor %}
            </div>

            <div class="clearfix"></div>
        </div>
    </div>

    <div class="clearfix"></div>

    <div class="panel panel-primary">
        <div class="panel-heading">Machines</div>
        <div class="panel-body">
            <ul class="nav nav-tabs nested-tabs sortable">
                <li class="add">
                    <a href="{{ path('puphpet.vagrantfile_local.machine') }}"
                       data-toggle="add-block">
                        <i class="fa fa-plus"></i> Add</a>
                </li>
                {% for index, machine in machines %}
                    {% set blockId = "vagrantfile-vm-provider-local-machines-#{index}" %}
                    {% set blockName = "vagrantfile[vm][provider][local][machines][#{index}]" %}
                    <li class="{{ loop.first ? 'active' }}">
                        <a href="#" data-target="#{{ blockId }}"
                           data-toggle="tab">{{ index }}</a>
                        <div class="btn-group">
                            <button type="button" class="btn btn-default"
                                    data-toggle="delete-block"
                                    data-target="#{{ blockId }}">
                                <i class="fa fa-close"></i></button>
                        </div>
                        <input type="hidden" name="{{ blockName }}" value="1" />
                    </li>
                {% endfor %}
            </ul>

            <div class="tab-content">
                <div class="empty-tabs">
                    <i class="fa fa-share fa-rotate-270" aria-hidden="true"></i>
                    Click to add a local machine
                </div>
                {% for index, machine in machines %}
                    {% include 'PuphpetBundle:vagrantfile-local:machine.html.twig' with {
                        'machine': machine,
                        'uniqid': index,
                        'active': loop.first ? true : false,
                    } %}
                {% endfor %}
            </div>
        </div>
    </div>

    <div class="panel panel-primary">
        <div class="panel-heading">Shared Folders</div>
        <div class="panel-body">
            <ul class="nav nav-tabs nested-tabs sortable">
                <li class="add">
                    <a href="{{ path('puphpet.vagrantfile_local.synced_folder') }}"
                       data-toggle="add-block">
                        <i class="fa fa-plus"></i> Add</a>
                </li>
                {% for index, synced_folder in syncedFolders %}
                    {% set blockId = "vagrantfile-vm-synced_folder-#{index}" %}
                    {% set blockName = "vagrantfile[vm][synced_folder][#{index}]" %}
                    <li class="{{ loop.first ? 'active' }}">
                        <a href="#" data-target="#{{ blockId }}"
                           data-toggle="tab">{{ index }}</a>
                        <div class="btn-group">
                            <button type="button" class="btn btn-default"
                                    data-toggle="delete-block"
                                    data-target="#{{ blockId }}">
                                <i class="fa fa-close"></i></button>
                        </div>
                        <input type="hidden" name="{{ blockName }}" value="1" />
                    </li>
                {% endfor %}
            </ul>

            <div class="tab-content">
                <div class="empty-tabs">
                    <i class="fa fa-share fa-rotate-270" aria-hidden="true"></i>
                    Click to add a shared folder
                </div>
                {% for index, synced_folder in syncedFolders %}
                    {% include 'PuphpetBundle:vagrantfile-local:synced-folder.html.twig' with {
                        'synced_folder': synced_folder,
                        'uniqid': index,
                        'active': loop.first ? true : false,
                    } %}
                {% endfor %}
            </div>
        </div>
    </div>

    <div class="panel panel-primary">
        <div class="panel-heading">Proxy Options</div>
        <div class="panel-body">
            <div class="checkbox checkbox-md no-padding mb-20">
                <input type="checkbox" id="vagrantfile-proxy-enabled"
                       name="vagrantfile[proxy][enabled]" value="1"
                       {% if proxy %}checked{% endif %}
                       data-toggle="checkbox-collapse"
                       data-target="#vagrantfile-proxy-enabled-container" />
                <label for="vagrantfile-proxy-enabled">Enable Proxy</label>
            </div>

            <div class="clearfix"></div>

            <div id="vagrantfile-proxy-enabled-container"
                 class="collapse {% if proxy %}in{% endif %}">
                <div class="help-block">
                    <p>
                        Requires installing the <code>vagrant-proxyconf</code> plugin:
                        <code>vagrant plugin install vagrant-proxyconf</code>
                    </p>

                    <p><a href="https://github.com/tmatilai/vagrant-proxyconf/"
                          target="_blank">Click here for more information</a>.</p>
                </div>

                <div class="form-group col-xs-12 col-sm-6">
                    <label for="vagrantfile-proxy-http">
                        Proxy for HTTP URIs
                    </label>
                    <input type="text" id="vagrantfile-proxy-http"
                           name="vagrantfile[proxy][http]"
                           placeholder="http://192.168.0.2:3128/" class="form-control"
                           value="{{ proxy_http }}" />
                </div>

                <div class="form-group col-xs-12 col-sm-6">
                    <label for="vagrantfile-proxy-https">
                        Proxy for HTTPS URIs
                    </label>
                    <input type="text" id="vagrantfile-proxy-https"
                           name="vagrantfile[proxy][https]"
                           placeholder="http://192.168.0.2:3128/" class="form-control"
                           value="{{ proxy_https }}" />
                </div>

                <div class="clearfix"></div>

                <div class="form-group col-xs-12 col-sm-6">
                    <label for="vagrantfile-proxy-ftp">
                        Proxy for FTP URIs
                    </label>
                    <input type="text" id="vagrantfile-proxy-ftp"
                           name="vagrantfile[proxy][ftp]"
                           placeholder="http://192.168.0.2:3128/" class="form-control"
                           value="{{ proxy_ftp }}" />
                </div>

                <div class="form-group col-xs-12 col-sm-6">
                    <label for="vagrantfile-proxy-no_proxy">
                        Comma-Separated Excluded Hosts or Domains
                    </label>
                    <input type="text" id="vagrantfile-proxy-no_proxy"
                           name="vagrantfile[proxy][no_proxy]"
                           placeholder="localhost,127.0.0.1,.example.com" class="form-control"
                           value="{{ proxy_no_proxy }}" />
                </div>
            </div>
        </div>
    </div>
</div>

<div class="container-fluid cm-container-white section-footer">
    <a href="#system-packages" data-toggle="tab" class="btn btn-primary btn-lg pull-right">
        System Packages
        <i class="fa fa-arrow-right" aria-hidden="true"></i>
    </a>
</div>

<div class="modal fade" id="vagrantfile-local-modal" tabindex="-1" role="dialog"
     aria-labelledby="vagrantfile-local-modal-label" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="vagrantfile-local-modal-label">
                    Instructions for Local Deployment
                </h4>
            </div>
            <div class="modal-body">
                <ol>
                    <li><a href="https://www.virtualbox.org/wiki/Downloads" target="_blank">Download the latest version
                            of VirtualBox from here</a></li>
                    <li><a href="http://www.vagrantup.com/downloads.html" target="_blank">Download the latest version of
                            Vagrant from here.</a></li>
                </ol>

                <p>
                    To login to your VM you must use <code>$ vagrant ssh</code> or user <code>vagrant</code>
                    using the private key automatically generated at
                    <code>puphpet/files/dot/ssh/id_rsa.key</code>. This key is generated <strong>after</strong>
                    your initial <code>$ vagrant up</code>!
                </p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
